<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <script src="js/jquery.min.js"></script>
    <script src="js/angular.js"></script>
    <script src="js/angular-ui-router.js"></script>
    <script type="text/javascript" src="js/iscroll.js"></script>
    <script src="js/jquery-barcode.js"></script>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0">
    <link rel="stylesheet" type="text/css" href="/less/index.css">
    <link rel="stylesheet" href="sass/role.css" />
    <link rel="stylesheet" href="sass/loginPage.css" />
    <link rel="stylesheet" href="less/home.css" />
    <link rel="stylesheet" href="sass/myProducts.css" />
    <meta name="Author" content="npc-guangming">
    <title>练习</title>
</head>

<body ng-app='routingDemoApp'>
    <div id="footer">
        <div id="menu" class="tab">
            <a href="#/role"><img src="img/role.png"></a>
        </div>
        <div id="home" class="tab">
            <a href="#/"><img src="img/home.png">
            </a>
        </div>
        <div id="myine" class="tab">
            <a href="#/myproducts"><img src="img/mine.png">
            </a>
        </div>
    </div>
    <div class="view" ng-view></div>
    <script>
    var app = angular.module('routingDemoApp', ['ngRoute', 'ctrls']);
    app.config(['$routeProvider', function($routeProvider, $stateProvider) {
        $routeProvider
            .when('/', {
                templateUrl: '/html/home.html',
            })
            .when('/role', {
                templateUrl: '/html/role.html',
                controller: 'roleCtrl'
            })
        .when('/mine', {
            templateUrl: '/html/login.html',
            controller: 'mineCtrl'
        })


        .when('/myproducts', {
            templateUrl: 'html/myProducts.html',
            controller: 'myProductsCtrl'
        })


    }]);
    var isLoad = 0;
    $(function() {
        isLoad = 1;
    })
    app.controller("home_Page", function($scope) {
        var data = {
            "list": [{
                "id": "1",
                "pic": "img/1.png",
                "price": "2.1",
                "count": "3",
                "title": "百事哇哈哈百事哇哈哈百事哇哈哈百事哇哈哈"
            }, {
                "id": "3",
                "pic": "/img/1.png",
                "price": "6.6",
                "count": "2",
                "title": "可乐哇哈哈"
            }]
        }
        $scope.items = data.list;
        var count = 0;
        for (var i = 0; i < data.list.length; i++) {
            var a = parseFloat(data.list[i].price) * parseFloat(data.list[i].count);
            count += a;
        }
        $("#submlit label").text(count.toFixed(2));
        $scope.sub = function(gid, price) {
            var cid = "#count" + gid;
            var lid = "#li" + gid;
            var num = $(cid).text();
            num--;
            count -= parseFloat(price);
            $("#submlit label").text(count.toFixed(2));
            if (num > 0) {
                $(cid).text(num);
                for (var i = 0; i < data.list.length; i++) {
                    if (data.list[i].id == gid) {
                        data.list[i].count = num;
                    }
                }

            } else {
                $(lid).remove();
                for (var i = 0; i < data.list.length; i++) {
                    if (data.list[i].id == gid) {
                       data.list.splice(i,1)
                    }
                }
                
            }
        }
        $scope.add = function(gid, price) {
            var cid = "#count" + gid;
            var num = $(cid).text();
            num++;
            count += parseFloat(price);
            $("#submlit label").text(count.toFixed(2));
             for (var i = 0; i < data.list.length; i++) {
                    if (data.list[i].id == gid) {
                        data.list[i].count = num;
                    }
                }
            $(cid).text(num);
        }
        $scope.submit = function() {
            console.log(data);
        }

    })
    </script>
    <script src="controller/ctrls.js"></script>
</body>

</html>
